import React, { useState } from "react";
import { Button ,Select} from "antd";

const Paginator = (props) => {
 const { pageParams, onChangePage,page } = props;
 const {pageSize,pageNo}=pageParams||{};
  const handlePrevPage = () => {
    if (pageNo > 1) {
      onChangePage({ pageNo: pageNo - 1 });
    }
  };

  const handleNextPage = () => {
    if (pageNo < page) {
      onChangePage({ pageNo: pageNo + 1 });
    }
  };

  return (
    <div className="content-management-pagination">
      <div className="pagination-label">每页显示：</div>

      <Select style={{ width: 62, marginRight: 40 }} defaultValue={2} onChange={(value) => {
        onChangePage({ pageSize: value, pageNo: 1 });
      }}>
        <option value="2">2</option>
        <option value="10">10</option>
        <option value="15">15</option>
      </Select>
      <Button  onClick={handlePrevPage} disabled={pageNo === 1}>
        上一页
      </Button>
      <div className="pagination-page-detail">
        <span className="page-left">{pageNo}</span>/{page}
      </div>
      <Button  onClick={handleNextPage} disabled={pageNo === page}>
        下一页
      </Button>
    </div>
  );
};

export default Paginator;
